<template>
  <div class="container">
    <el-form ref="form" :model="form" label-width="80px">
      <el-form-item label="学号" >
        <el-input v-model="form.s_id" :disabled="true"></el-input>
      </el-form-item>
      <el-form-item label="姓名" >
        <el-input v-model="form.s_name" :disabled="true"></el-input>
      </el-form-item>
      <el-form-item label="邮箱">
        <el-input v-model="form.s_email"></el-input>
      </el-form-item>
      <el-form-item label="电话">
        <el-input v-model="form.s_tel"></el-input>
      </el-form-item>
      <el-form-item>
        <el-button type="primary" @click="onSubmit">修改</el-button>
      </el-form-item>
    </el-form>
  </div>
</template>

<script>
import { updateInfor } from '@/api/user'
export default {
  data() {
    return {
      form: {
        s_id: '',
        s_name: '',
        s_email: '',
        s_tel: ''
      }
    }
  },
  methods: {
    onSubmit() {
      updateInfor({ 's_id': this.form.s_id, 's_name': this.form.s_name, 's_email': this.form.s_email, 's_tel': this.form.s_tel }).then(response => {
        this.$message({
          message: response.message,
          type: response.data.message
        })
      })
    }
  },
  created: function() {
    this.form.s_id = this.$store.getters.s_id
    this.form.s_name = this.$store.getters.name
  }
}

</script>

<style lang="scss" scoped>
  .container{
    width: 50%;
    margin: auto;
    margin-top:10px
  }
</style>
